<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
    <title>首页</title>
    <link rel="stylesheet" href="css/weui.min.css">
    <link rel="stylesheet" href="css/jquery-weui.css">
    <link rel="stylesheet" href="css/demos.css">
    <link rel="stylesheet" href="css/main.css">
    <link rel="stylesheet" type="text/css" href="./js/swiper.min.css" />
    <script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=ZSXGYc4z7RLVClUmrlL1w9cH9DRghNuw"></script>

    <style>
        .weui_grid_label {
            color: #666;
        }

        .xx-lb {
            margin: 0 auto;
            width: 100%;
        }

        .xx-lb li ul li,
        .xx-lb li {
            padding: 0 !important;
            margin-bottom: 0 !important;
            line-height: 20px;
            font-size: 14px !important;
            color: #666 !important;
        }

        .weui-cells {
            margin-top: 0;
            font-size: 14px;
        }

        .topNavs {
            display: flex;
            position: fixed;
            z-index: 99;
            top:0;left:0;width: 100%;
            align-items: center;
            justify-content: space-between;
            height: 44px;
            padding: 0 15px;
            box-sizing: border-box;
            background: #0F78FB;
            color: #333;
        }

        .putInput {
            width: 220px;
            padding-left: 20px;
            height: 25px;
            border-radius: 12.5px;
            border: solid 1px #e1e2e3;
            /* background: url("./images/searchs.png") 10px 2.5px no-repeat; */
            background-size: 20px 20px;
            color: #7F7F7F;
            font-size: 14px;
            line-height: 25px;
            background-color: #fff;
        }

        .topNavs .headImg {
            width: 25px;
            height: 25px;
            border-radius: 50%;
        }

        .add {
            width: 100%;
        }

        .kb {
            margin-top: 0;
        }

        .shop_warp {
            padding: 10px 10px;
        }

        .shop_li {
            width: 48%;
            border-radius: 5px;
            background: #fff;
            margin-bottom: 20px;
        }

        .shop_img {
            width: 100%;
            height: 180px;
            object-fit: cover;
        }

        .shop_ul {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
            font-size: 0;
        }

        .shop_info {
            padding: 10px;
            position: relative;
        }

        .shop_title {
            font-size: 14px;
            font-weight: 600;
            color: #666;
            overflow: hidden;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 1;
        }

        .shop_youhui {
            font-size: 12px;
            color: #0F78FB;
        }

        .shop_address {
            font-size: 12px;
            color: #fff;
            position: absolute;
            top: -25px;
            left: 5px;
            padding: 0 10px;
            line-height: 20px;
            border-radius: 3px;
            background: rgba(0, 0, 0, .3);
        }

        .swiper-slide {
            height: 80px;
        }

        .swiper-container {}

        .swiper_worp_outer {
            margin: 10px;
            padding: 10px;
            border-radius: 5px;
            overflow: hidden;
            background: #fff;
        }

        .weui_grid_box {
            width: 20%;
            height: 30%;
        }

        .slide_icon {
            height: 180px;
        }

        .slide_icon ul li {
            box-sizing: border-box;
            padding: 20px 0;
            display: flex;
            flex-wrap: wrap;
        }

        .slide_icon li img {
            position: static;
            width: 40px;
            height: 40px;
        }

        .swiper_paging {
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
            text-align: center;
        }

        .swiper_paging span {
            display: inline-block;
            width: 6px;
            height: 6px;
            border-radius: 4px;
            background-color: #808080;
        }

        .swiper_active {
            background-color: #6670FF !important;
            width: 14px !important;
        }

        .icon-zuo {
            font-size: 25px;
            color: #fff;
        }

        .icon-location {
            font-size: 18px;
        }

        .current_city {
            color: #fff;
        }

        .city_list {
            width: 100%;
            max-height:100%;
            overflow: auto;
            box-sizing: border-box;
            padding-top: 44px;
        }
        .city_list ul{display: none}
        .geographical {
            height: 100%;
            display: none;
        }
        .city_list>li {
            border-bottom:1px solid #e8e8e8;
        }
        .city_list ul {
            padding-left:10px;
        }
        .city_list ul ul {
            padding-left:20px;
        } .city_list ul ul .weui-cell__ft {
            display: none;
        }
        .shop_youhui{
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            word-break: break-all;
            -webkit-line-clamp: 1;
            -webkit-box-orient: vertical;
            -moz-line-clamp: 1;
            -moz-box-orient: vertical;
            -o-line-clamp: 1;
            -o-box-orient: vertical;
            -ms-line-clamp: 1;
            -ms-box-orient: vertical;
        }
    </style>

</head>

<body ontouchstart>
    <div class="content_box" >
        <!--头部导航-->
        <div class="topNavs" >
            <div id="js_city" style="color: #fff;"><span class="currentCity" >选择地区</span><i class="iconfont icon-xia"></i></div>
            <a href="javascript:void (0)" onclick="toSearch()">
                <div class="putInput"><i class="iconfont icon-search"></i>&nbsp;&nbsp;搜索商家</div>
            </a>
            <a href="javascript:void (0)" style="line-height: 100%;" onclick="toMe()">
                <img src="./images/head_img.png" alt="" class="headImg">
            </a>
        </div>
        <div class="block" style="height: 44px"></div>

        <!--分类模块-->
        <div class="slide slide_icon" id="slide3">
            <ul id="shopTypeList">

            </ul>
            <div class="swiper_paging" id="swiperList">
                <!--<span class="swiper_active"></span>
                <span></span>-->
            </div>
        </div>

        <!--轮播图-->
        <div class="slide" id="slide2">
            <ul id="carouselList">

            </ul>
        </div>

        <!--广告商铺展示-->
        <div class="shop_warp" >
            <ul class="shop_ul" id="shopList">


            </ul>
        </div>
     <div class="weui-loadmore ">
            <i class="weui-loading"></i>
            <span class="weui-loadmore__tips">正在加载</span>
        </div>
        <div class="kong3"></div>
        <!--底部导航栏-->
        <div class="weui-tabbar" >
            <!--<a href="index.html?infrom=2" class="weui-tabbar__item weui-bar__item&#45;&#45;on">
                <div class="weui-tabbar__icon">
                    <img src="images/shouye1.png" alt="">
                </div>
                <p class="weui-tabbar__label">首页</p>
            </a>
            <a href="discover.html" class="weui-tabbar__item">
                <div class="weui-tabbar__icon">
                    <img src="images/faxianguanli.png" alt="">
                </div>
                <p class="weui-tabbar__label">发现</p>
            </a>
            <a href="cellect.html" class="weui-tabbar__item">
                <div class="weui-tabbar__icon">
                    <img src="images/order.png" alt="">
                </div>
                <p class="weui-tabbar__label">收藏</p>
            </a>
            <a href="me.html" class="weui-tabbar__item">
                <div class="weui-tabbar__icon">
                    <img src="images/me.png" alt="">
                </div>
                <p class="weui-tabbar__label">我的</p>
            </a>-->
            <!-- <a class="fb" href="sc-fb.html"></a> -->
        </div>
    </div>
    <!-- 地理位置 -->
    <div class="geographical">
        <div class="topNavs">
            <i class="iconfont icon-zuo" id="js_shop"></i>
            <a href="./search.html">
                <div class="putInput"><i class="iconfont icon-search"></i>&nbsp;&nbsp;城市</div>
            </a>
            <span class="current_city"><i class="iconfont icon-location"></i><label class="currentCity">选择地区</label>
              </span>
        </div>
        <ul class="city_list">
        </ul>
    </div>
    <script src="js/jquery-2.1.4.js"></script>
    <script src="js/jquery-weui.js"></script>
    <script src="js/swipe.js"></script>
    <script src="js/swiper.min.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
    <script src="wxJs/utils/storage.js" ></script>
    <script src="wxJs/utils/contain.js" ></script>
    <script src="wxJs/index.js" ></script>
</body>

</html>